<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>8jQuery val()-手机号验证</title>
</head>
<body>
    <form>
        <p>
            <label for="tel">手机号：</label>
            <input type="tel" name="tel" id="tel">
        </p>
        <p>
            <button type="submit">提交手机号验证</button>
        </p>
    </form>
    <script src="./jQuery2.js"></script>
    <script>
        //扩展讲解 使用jQuery拦截 form表单提交事件
        $("#form1").submit(function(e){
            let tel =$("#tel").val();
            /*扩展知识:正则匹配表达式规则
            *`/`和`/`之间的东西是检验规则
            *^表示完全匹配(必须保证你的手机号1开头)第一个数字必须是1
            *`[`和`]`之间表示包含[345]表示第二个数字可以是3 4 5任意一个
            *\d表示数字0-9{9}表示前面规则实现9次
            */
            let reg = /^1[3456789]\d{9}$/;
        if(reg.test(tel)){  // reg 规则调用test方法验证tel
            alert("手机号合法")
        }else{
            alert("手机号不合法")
        }
        //返回一个return false 禁止 form表单默认提交效果
            return false;
        })
    </script>
    
</body>
</html>